<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row v-if="titleText!='审批'">
          <a-col :span="12">
            <a-form-model-item label="设备名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="equipId">
              <j-popup
                v-model="model.equipId_dictText"
                field="device_name"
                org-fields="device_name,id"
                dest-fields="equipId_dictText,equipId"
                code="equipment_copy"
                :multi="false"
                @input="popupCallback" />

            </a-form-model-item>
          </a-col>

          <a-col :span="12">
            <a-form-model-item label="选择审批人" :labelCol="labelCol" :wrapperCol="wrapperCol"prop="approveUser">
              <j-select-multi-user :multiple='false' v-model="model.approveUser" />
            </a-form-model-item>
          </a-col>

          <a-col :span="12">
            <a-form-model-item label="开机时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="hourBoottime">
              <a-time-picker placeholder="请选择开机时间"   v-model="model.hourBoottime"   style="width: 100%" @change="onChangeBoottime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="关机时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="hourOfftime">
              <a-time-picker placeholder="请选择关机时间"  v-model="model.hourOfftime"   style="width: 100%" @change="onChangeOfftime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="计划停机时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="downTime">
              <a-input-number v-model="model.downTime" placeholder="请输入计划停机时长" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="非计划停机时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="unDownTime">
              <a-input-number v-model="model.unDownTime" placeholder="请输入非计划停机时长" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="12">
            <a-form-model-item label="运行时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <template v-if="timeDiff - model.downTime - model.unDownTime >= 0">
                {{(timeDiff - model.downTime - model.unDownTime).toFixed(2)}}
              </template>
              <template v-else>
                <span style="color: red;">填写错误，运行时长不能为负数</span>
              </template>
            </a-form-model-item>
          </a-col>
          <a-col :span="12" v-if="model.approveStatus==1||model.approveStatus==0">
            <a-form-model-item label="审批备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
              {{model.approveRemarks}}
            </a-form-model-item>
          </a-col>
        </a-row>


        <a-row v-if="titleText=='审批'">
          <a-col :span="24">
            <a-form-model-item label="设备名称" :labelCol="labelCol" :wrapperCol="wrapperCol" >
              {{model.equipId_dictText}}
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="选择审批人" :labelCol="labelCol" :wrapperCol="wrapperCol">
                {{model.approveUser_dictText}}
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="开机时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
              {{ model.hourBoottime }}
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="关机时间" :labelCol="labelCol" :wrapperCol="wrapperCol" >
              {{ model.hourOfftime }}
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="计划停机时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol" >
              {{ model.downTime }}
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="非计划停机时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol" >
              {{ model.unDownTime }}
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="运行时长(小时)" :labelCol="labelCol" :wrapperCol="wrapperCol" >
              {{model.runningTime}}
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="审批状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="approveStatus">
              <j-search-select-tag
                placeholder="请选择审批状态"
                v-model="model.approveStatus"
                :dictOptions="dictOptions"
                >
              </j-search-select-tag>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="审批备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="approveRemarks" >
              <a-textarea v-model="model.approveRemarks" rows="4" placeholder="请输入审批备注" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import moment from 'moment';
  export default {
    name: 'UnPowerExportTempForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        titleText:"",
        insData:[],
        model:{
          downTime:0,
          unDownTime:0,
         },
        timeDiff:0,
        labelCol: {
          xs: { span: 24 },
          sm: { span: 8 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 14 },
        },
        dictOptions:[
          {
            text:"通过",
            value:"1"
          },{
            text:"驳回",
            value:"0"
          },{
            text:"待审批",
            value:"-1",
            disable:true,
          }
        ],
        confirmLoading: false,
        validatorRules: {
          equipId:[
            { required: true, message: '请选择设备!'},
          ],
          hourBoottime:[
            { required: true, message: '请选择开机时间!'},
          ],
          hourOfftime:[
            { required: true, message: '请选择关机时间!'},
          ],
          downTime:[
            { required: true, message: '请选择计划停机时长!'},
          ],
          unDownTime:[
            { required: true, message: '请选择非计划停机时长!'},
          ],
          approveStatus:[
            { required: true, message: '请选择审批状态!'},
          ],
        },
        url: {
          add: "/eneEquipmentRunningRecord/eneEquipmentRunningRecord/eqpRun",
          edit:"/eneEquipmentRunningRecord/eneEquipmentRunningRecord/edit"
        },
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      moment,
      onChangeBoottime(time,timeString){

        //(this.model.hourBoottime==null||this.model.hourOfftime==null)?0:moment(this.model.hourOfftime).diff(moment(this.model.hourBoottime),"hours",true)
        this.model.hourBoottime=moment(time).format('YYYY-MM-DD HH:mm:ss')
        this.runtime()
      },
      onChangeOfftime(time,timeString){
        this.model.hourOfftime=moment(time).format('YYYY-MM-DD HH:mm:ss')
        this.runtime()
      },
      runtime(){
        if(this.model.hourBoottime==null||this.model.hourOfftime==null){

          return
        }
        var a = moment(this.model.hourOfftime);
        var b = moment(this.model.hourBoottime);
        this.timeDiff  =  a.diff(b, 'hours', true);
      },

      add () {
        this.edit(this.modelDefault);
      },
      edit (record,text) {
        this.titleText=text

        this.model = Object.assign({}, record);
        this.runtime()
        console.log("=================")
        console.log(this.timeDiff)
        this.visible = true;
      },
      popupCallback(value, row) {
        this.model = Object.assign(this.model, row)
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              //新增传入运行时间
              this.model.runningTime=(this.timeDiff-this.model.downTime-this.model.unDownTime).toFixed(2)
              if(this.model.runningTime<0){
                that.$message.warning("计划停机时长+非计划停机时长大于运行时长")
                that.confirmLoading = false;
                return
              }
              httpurl+=this.url.add;
              method = 'post';
            }else{
              //审批强制选择审批状态
              if(that.titleText=='审批'){
                if(that.model.approveStatus==-1){
                  that.$message.warning("请选择审批状态")
                  that.confirmLoading = false;
                  return
                }
              }
              //修改状态强制变回待审批
              else if (that.titleText=='修改'){
                that.model.approveStatus=-1
              }
              httpurl+=this.url.edit;
               method = 'put';
            }

            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                if(that.titleText=='审批'){
                  that.$message.success("审批成功");
                }else{
                  that.$message.success(res.message);
                }

                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }

        })
      },
    }
  }
</script>